<!doctype html>
<html>

<head>
	<meta charset="UTF-8">
	<title></title>
	<meta name="viewport" content="viewport-fit=cover,width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
	<link href="../../../css/mui.min.css" rel="stylesheet" />
	<link rel="stylesheet" type="text/css" href="../../../css/reset.css" />
	<link rel="stylesheet" type="text/css" href="../../../css/style.css" />
</head>

<body>
	<div id="objectiveQuestionsBox">
		<header class="mui-bar mui-bar-nav">
			<a class=" mui-icon mui-icon-left-nav mui-pull-left" @tap="back_but"></a>
			<span class="exer_icons"  v-show="questionBoxStatus == 1">
				<a @tap="open_jc" class="mui-icon mui-icon-feedback mui-pull-right"></a>
				<a @tap="add_collection" v-show="collection_status == 0" class="mui-icon mui-icon-collect mui-pull-right"></a>
				<a @tap="add_collection" v-show="collection_status == 1" class="mui-icon mui-icon-collected mui-pull-right orange"></a>
				<a @tap="open_dtk" class="mui-icon mui-icon-answerSheet mui-pull-right"></a>
			</span>
		</header>

		<div class="errorBoxTips"  v-show="questionErrorBoxStatus == 1">
			<img src="../../../images/error_img.png">
			<p>{{errorTipsContent}}</p>
			<button type="button" class="mui-btn mui-btn-outlined" @tap="clickRefresh">刷新</button>
		</div>

		<div class="mui-content getHeight" v-show="questionBoxStatus == 1">
			<div class="exercise_tt">
				<span v-if="type == 1">单选题</span>
				<span v-else-if="type == 2">多选题</span>
				<span v-else-if="type == 3">判断题</span>
				<span class="exer_num"><em class="red">{{q_index + 1}}</em>/{{other.count_num}}</span>
			</div>
			<transition-group name="questionfade" mode="out-in">
				<div class="exercise_nr" :key="ind" v-for="(val,ind) in question_list" v-if="q_index == ind  && type != 3">
					<h3 class="question">{{q_index + 1}}：{{val.question_title}}</h3>
					<ul class="anwser_item mui-table-view" v-if="type == 1">
						<li v-for="op in val.option_list" :class="opIndex == op.id ? 'active' : ''" class="dan_option mui-table-view-cell"
						 @tap="xuanzhong_danxuan_option($event)" :qid="val.id" :option-id="op.id"><span>{{op.abc_index}}</span>{{op.opition_content}}</li>
					</ul>
					<ul class="anwser_item_more mui-table-view p0" v-if="type == 2">
						<li v-for="op in val.option_list" :class="'duoxuan_'+op.id" class="duo_option mui-table-view-cell" @tap="xuanzhong_duoxuan_option($event)"
						 :qid="val.id" :option-id="op.id"><span>{{op.abc_index}}</span>{{op.opition_content}}</li>
					</ul>
				</div>
				<div class="exercise_nr" :key="ind" v-for="(val,ind) in question_list" v-if="q_index == ind && type == 3">
					<h3 class="question">{{q_index + 1}}：{{val.title}}</h3>
					<ul class="anwser_item mui-table-view">
						<li @tap="dj_zq" :qid="val.id" class="dj_zq mui-table-view-cell"><span>T</span>正确</li>
						<li @tap="dj_cw" :qid="val.id" class="dj_cw mui-table-view-cell"><span>F</span>错误</li>
					</ul>
				</div>
			</transition-group>
		</div>

		<!--答题卡弹窗-->
		<div class="popMask" @tap="yc_dtk"></div>
		<div class="popCard">
			<div class="popCont">
				<div class="pop_exer_tt">
					<div class="exer_ltt">
						答题卡
					</div>
					<div class="exer_rtt">
						<span><em class="dot_red"></em>已答</span>
						<span><em class="dot_grey"></em>未答</span>
					</div>
				</div>
				<div class="pop_exer_nr">
					<ul>
						<li v-for="(val,index) in userAnswer" @tap="tiaozhuan_que(index)" :class="val == 1 ? 'active' : ''">
							<a>{{index+1}}</a>
						</li>
					</ul>
				</div>
				<div class="fix_exer_result" @tap="tijiaojieguo">
					<a>提交并查看结果</a>
				</div>
			</div>
		</div>
	</div>
	
	<!--手势提示弹窗-->
	<div class="popTips">
		<div class="popTips_nr">
			<img src="../../../images/gesture.png" alt="" />
			<p>左右滑动显示上一题和下一题</p>
			<a class="closeTipBtn" href="javascript:;" @tap="yc_tips">我知道了</a>
		</div>
	</div>

	<script src="../../../js/mui.min.js"></script>
	<script type="text/javascript" src="../../../js/h.min.js"></script>
	<script src="../../../js/jquery.min.js"></script>
	<script type="text/javascript" src="../../../js/tpl/exercises.js"></script>
	<script src="../../../js/vue.js"></script>
	<script src="../../../js/public.js"></script>
</body>

</html>